<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">

		<title>七、window 窗口</title>

		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">

		<jsp:include page="../basic/easyui_loder.jsp" flush="true"/>

		<script type="text/javascript">
		
			/**
			 * 加载时的遮盖层
			 */
			var maskOnLoad = function(msg){
				/*
				$("<div id=\"maskWindowDiv\" class=\"datagrid-mask\"></div>").css({ display: "block", width: "100%", height: $(window).height() }).appendTo("body");
				$("<div class=\"datagrid-mask-msg\"></div>").html(msg).appendTo("body").css({ display: "block", left: ($(document.body).outerWidth(true) - 190) / 2, top: ($(window).height() - 45) / 2 });
				*/
				
				if($("#maskWindowDiv").length <= 0){
					
					$("<div id=\"maskWindowDiv\" style=\"text-align: center;\"></div>").appendTo("body").css({top: ($(window).height() - 45)/2});
					
					$("<div id=\"maskWindowDivMsg\" class=\"datagrid-mask-msg\" style=\"margin-left: 58px;\"></div>").html(msg).appendTo("#maskWindowDiv").css({ display: "block"});
					
					$("#maskWindowDiv").window({
						width: 300,
						height: 100,
						collapsible: false,
						minimizable: false,
						maximizable: false,
						noheader: true,
						border: false,
						closable: false,
						closed: false,
						zIndex: 99999,
						draggable: true,
						resizable: false,
						shadow: false,
						modal : true
						//top: 80
					})
				}else{
					$("#maskWindowDivMsg").html(msg);
				}
				$("#maskWindowDiv").window("open");
			}

			/**
			 * 加载完毕，隐藏遮盖层
			 */
			var closeMask = function(){
				$("#maskWindowDiv").window("close");
			}
		
			$(document).ready(function() {
				/**
				 * 插入可编辑行
				 */
				var appendNewRow = function(){
					$("#insertTab").datagrid("appendRow",{
						fieldName: "",
						fieldValue: "",
						fieldType: "StringField"
					});
					var rowIndex = $("#insertTab").datagrid("getRows").length - 1;
					$("#insertTab").datagrid("beginEdit",rowIndex);
				}
				
				/**
				 * 删除一个字段行
				 */
				var deleteOneRow = function(){
					var selectRows = $("#insertTab").datagrid("getSelections");
					if(selectRows.length == 0){
						$.messager.alert("警告","请选择要删除的行！");
					}else{
						for(var i=0;i<selectRows.length;i++){
							var oneRow = selectRows[i];
							var rowIndex = $("#insertTab").datagrid("getRowIndex");
							$("#insertTab").datagrid("deleteRow",rowIndex);
						}
					}
				}
				
				/**
				 * 初始化编辑表格
				 */
				var initInsertGrid = function(){
					$("#insertTab").datagrid({
						iconCls:"icon-save",
						width: 550,
						height: "auto",
						striped: true,//斑马线
						rownumbers: true,
						singleSelect: false,//是否单选
						columns:[[
							{field : "checkbox",checkbox: true},
							{field: "fieldName",title:"字段名称",width:150,editor:"text"},
							{field: "fieldValue",title:"字段值",width:150,editor: "textarea"},
							{field: "fieldType",title:"字段类型",width:150,editor:{
								type: "combobox",
								options: {data : [{
										"value" : "StringField",
										"text" : "StringField"
									},{
										"value"  : "IntField",
										"text" : "IntField"
									},{
										"value" : "TextField",
										"text" : "TextField"
									}],
									editable: false,
									panelHeight: "auto" //设置容器高度自动增长
								}
							}}
						]],
						toolbar:[{
							text: "添加新字段",
							iconCls: "icon-add",
							handler: function(){
								appendNewRow();
							}
						},{
							text: "删除字段",
							iconCls: "icon-cancel",
							handler: function(){
								deleteOneRow();
							}
						}],
						onDblClickRow: function(rowIndex, rowData){//双击
							$("#insertTab").datagrid("beginEdit",rowIndex);
						},
						onAfterEdit: function(index,row){
							row.editing = false;
							$("#insertTab").datagrid("refreshRow",index);
						},
						onCancelEdit: function(index,row){
							row.editing = false;
							$("#insertTab").datagrid("refreshRow",index);
						}
					});
				}
				
				/**
				 * 新增窗口
				 */
				$("#insertWindow").window({
					title : "新增",
					collapsible: false,
					minimizable: false,
					closed: false,
					modal : true,
					top: 80,
					icon: "icon-save",
					onOpen: function(){
						initInsertGrid();
						resetInsertGrid();
					}
				})
			});
			
			/**
			 * 重置表格
			 */
			var resetInsertGrid = function(){
				$("#insertTab").datagrid("loadData",
					{"rows":[{
						fieldName: "contentid",
						fieldValue: "",
						fieldType: "StringField"
					}]
				});
				$("#insertTab").datagrid("beginEdit",0);
			}
			
			/**
			 * 遍历grid 获得数据
			 */
			var getGridData = function(gridName){
				//docFieldList
				/*
				private String fieldName;//字段名称
				private String fieldValue;//字段值
				private String fieldType;//字段类型	StringField	IntField	TextField
				*/
				
				var saveData = "{";
				
				var rows = $("#" + gridName).datagrid("getRows");
				
				for(var i = 0;i<rows.length;i++){
					$("#insertTab").datagrid("endEdit",i);
					
					var oneRow = rows[i];
					
					var fieldName = oneRow.fieldName;
					var fieldValue = oneRow.fieldValue;
					var fieldType = oneRow.fieldType;
					if("" == fieldName || "" == fieldValue || "" == fieldType){
						$("#insertTab").datagrid("beginEdit",i);
						$.messager.alert("警告","第" + (i + 1) + "行数据不能为空！");
						return null;
					}else{
						if(i != 0){
							saveData += ",";
						}
						var doc = "docFieldList[" + i + "]";
						//{"docFieldList[i].fieldName": "123","docFieldList[i].fieldValue": "123","docFieldList[i].fieldType": "123"}
						saveData += "\"docFieldList[" + i + "].fieldName\":\"" + fieldName +
							"\",\"docFieldList[" + i + "].fieldValue\":\"" + fieldValue +
							"\",\"docFieldList[" + i + "].fieldType\":\"" + fieldType + "\"";
					}
				}
				
				saveData += "}";
				
				console.log(saveData);
				return saveData;
			}
			
			/**
			 * 保存
			 */
			var saveDocument = function(){
				var indexPath = "D:/lucene/file5/index";
				
				var jsonData = jQuery.parseJSON(getGridData("insertTab"));
				
				maskOnLoad("正在保存，请稍后。。。");
				
				$.ajax({
					type : "POST",
					dataType : "json",
					url : "luceneAction_insertOneDocument?indexPath=" + indexPath,
					data: jsonData,
					success : function(data){
						closeMask();
						
						console.log(data);
						
						if(data.success != null){
							$.messager.alert("成功",data.success);
							
							$("#insertWindow").window("close");
						}else{
							$.messager.alert("失败",data.error);
						}
					},
					error : function(XMLHttpRequest, textStatus,errorThrown){
						closeMask();
						alert("error...");
						$.messager.alert("警告","保存失败！");
					}
					
				});
			}
			
			
			
			
			
		</script>
	</head>

	<body>
		<hr />
		<h2>
			七、window 窗口
		</h2>
		<br/><br/><br/><br/>


		<div id="insertWindow" title="新增"  style="width: 600px; height: 500px; padding: 5px; ">
			<div class="easyui-layout" fit="true">
				
				<div region="center" style="padding: 10px;">
					<form id="insertForm" method="post">
						<table id="insertTab"></table>
						
					</form>
				</div>
				<div region="south" style="text- align: center; height: 30px;">
					<div style="width: 100%; text-align: center; min-width: 200px;">
						<a class="easyui-linkbutton" icon="icon-cancel" href="javascript:void(0)" onclick="resetInsertGrid()">重置</a>
						&nbsp;&nbsp;&nbsp;
						<a class="easyui-linkbutton" icon="icon-ok" href="javascript:void(0)" onclick="saveDocument()">提交</a>
					</div>
				</div>
			</div>
		</div>

	</body>
</html>
